<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>动脑学院</title>
  <link rel="stylesheet" href="./node_modules/normalize.css/normalize.css" media="screen" title="no title">
  <link rel="stylesheet" href="./node_modules/bootstrap/dist/css/bootstrap.min.css" media="screen" title="no title">
  <link rel="stylesheet" href="./css/dongnao.css" media="screen" title="no title">
</head>
<body>
  <nav class="navbar navbar-default" role="navigation">
    <div class="container">
      <!-- Logo 和移动设置收起菜单栏的按钮 -->
      <div class="navbar-header">
        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
          <span class="sr-only">Toggle navigation</span>
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
        </button>
        <a class="navbar-brand" href="#">
          <img src="img/logo.png" alt="" />
        </a>
      </div>

      <!-- 包含导航菜单和表单、其他内容 -->
      <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
        <ul class="nav navbar-nav">
          <li class="active"><a href="#">首页</a></li>
          <li><a href="#">VIP</a></li>
          <li><a href="#">视频库</a></li>
          <li><a href="#">活动</a></li>
          <li><a href="#">社区</a></li>
          <li class="dropdown">
            <a href="#" class="dropdown-toggle" data-toggle="dropdown">关于 <span class="caret"></span></a>
            <ul class="dropdown-menu" role="menu">
              <li><a href="#">关于动脑</a></li>
              <li><a href="#">学员风采</a></li>
              <li><a href="#">人才招聘</a></li>
              <li><a href="#">在线咨询</a></li>
            </ul>
          </li>
        </ul>
        <!-- 右边小图标 -->
        <form class="navbar-form navbar-right">
          <button type="button" class="btn btn-default btn-qq"></button>
          <button type="button" class="btn btn-default btn-weibo"></button>
        </form>
        <!-- 表单 -->
        <form class="navbar-form navbar-right" role="search">
          <div class="form-group">
            <input type="text" class="form-control" placeholder="输入搜索内容">
          </div>
          <button type="submit" class="btn btn-default">搜索</button>
        </form>

      </div><!-- /.navbar-collapse -->
    </div><!-- /.container-fluid -->
  </nav>
  <div id="banner" class="carousel slide" data-ride="carousel">
    <!-- 小圆点 -->
    <ol class="carousel-indicators">
      <li data-target="#carousel-example-generic" data-slide-to="0"></li>
      <li data-target="#carousel-example-generic" data-slide-to="1" class="active"></li>
      <li data-target="#carousel-example-generic" data-slide-to="2"></li>
    </ol>

    <!-- 卡片容器 -->
    <div class="carousel-inner" role="listbox">
      <div class="item">
        <img src="img/banner1.png" alt="...">
      </div>
      <div class="item active">
        <img src="img/banner2.png" alt="...">
      </div>
      <div class="item">
        <img src="img/banner5.png" alt="...">
      </div>
    </div>

    <!-- 控制器 -->
    <a class="left carousel-control" href="#banner" role="button" data-slide="prev">
      <span class="glyphicon glyphicon-chevron-left"></span>
      <span class="sr-only">上一张</span>
    </a>
    <a class="right carousel-control" href="#banner" role="button" data-slide="next">
      <span class="glyphicon glyphicon-chevron-right"></span>
      <span class="sr-only">下一张</span>
    </a>
  </div>
  <div class="container">
    <div class="row">
      <div class="col-md-12">
        <h3>VIP 课程</h3>
        <hr>
      </div>
    </div>
    <div class="row">
      <div class="col-md-3 col-xs-6">
        <a href="" class="thumbnail">
          <img src="img/android.jpg" alt="" />
        </a>
      </div>
      <div class="col-md-3 col-xs-6">
        <a href="" class="thumbnail">
          <img src="img/js.jpg" alt="" />
        </a>
      </div>
      <div class="col-md-3 col-xs-6">
        <a href="" class="thumbnail">
          <img src="img/java.jpg" alt="" />
        </a>
      </div>
      <div class="col-md-3 col-xs-6">
        <a href="" class="thumbnail">
          <img src="img/web.jpg" alt="" />
        </a>
      </div>
      <div class="col-md-3 col-xs-6">
        <a href="" class="thumbnail">
          <img src="img/php.jpg" alt="" />
        </a>
      </div>
      <div class="col-md-3 col-xs-6">
        <a href="" class="thumbnail">
          <img src="img/ui.jpg" alt="" />
        </a>
      </div>
      <div class="col-md-3 col-xs-6">
        <a href="" class="thumbnail">
          <img src="img/c++.jpg" alt="" />
        </a>
      </div>
      <div class="col-md-3 col-xs-6">
        <a href="" class="thumbnail">
          <img src="img/embed.jpg" alt="" />
        </a>
      </div>
    </div>
  </div>
  <div class="container">
    <div class="row">
      <div class="col-md-12">
        <h3>今日公开课</h3>
        <hr>
      </div>
    </div>
    <div class="row">
      <div class="col-xs-6 col-md-3">
        <div class="thumbnail">
          <img src="img/openClass1.png" alt="...">
          <div class="caption">
            <p>讲师： Star老师</p>
            <p>时间： 7月31日 20:30</p>
            <p>地点： 腾讯课堂</p>
            <p class="text-center">
              <a href="#" class="btn btn-primary btn-sm" role="button">立即学习</a>
            </p>
          </div>
        </div>
      </div>
      <div class="col-xs-6 col-md-3">
        <div class="thumbnail">
          <img src="img/openClass2.png" alt="...">
          <div class="caption">
            <p>讲师： Star老师</p>
            <p>时间： 7月31日 20:30</p>
            <p>地点： 腾讯课堂</p>
            <p class="text-center">
              <a href="#" class="btn btn-primary btn-sm" role="button">立即学习</a>
            </p>
          </div>
        </div>
      </div>
      <div class="col-xs-6 col-md-3">
        <div class="thumbnail">
          <img src="img/openClass3.png" alt="...">
          <div class="caption">
            <p>讲师： Star老师</p>
            <p>时间： 7月31日 20:30</p>
            <p>地点： 腾讯课堂</p>
            <p class="text-center">
              <a href="#" class="btn btn-primary btn-sm" role="button">立即学习</a>
            </p>
          </div>
        </div>
      </div>
      <div class="col-xs-6 col-md-3">
        <div class="thumbnail">
          <img src="img/openClass4.png" alt="...">
          <div class="caption">
            <p>讲师： Star老师</p>
            <p>时间： 7月31日 20:30</p>
            <p>地点： 腾讯课堂</p>
            <p class="text-center">
              <a href="#" class="btn btn-primary btn-sm" role="button">立即学习</a>
            </p>
          </div>
        </div>
      </div>
    </div>
  </div>
  <div class="container">
    <div class="row">
      <div class="col-md-12">
        <h3>明星学员</h3>
        <hr>
      </div>
    </div>
    <div class="row">
      <div class="col-md-6 col-xs-12 student">
        <div class="media">
          <a class="media-left" href="#">
            <img src="img/student1.png" alt="...">
          </a>
          <div class="media-body">
            <h4 class="media-heading">张洪涛</h4>
            <p>
              所学课程<a href="">《ANDROID/安卓/自定义控件/NDK/架构/REACT/性能优化【动脑学院】》</a>动脑学院ANDROID开发课程毕业学员，就职于新浪，任职安卓高级工程师，薪资15K*16
            </p>
          </div>
        </div>
      </div>
      <div class="col-md-6 col-xs-12 student">
        <div class="media">
          <a class="media-left" href="#">
            <img src="img/student2.png" alt="...">
          </a>
          <div class="media-body">
            <h4 class="media-heading">王登辉</h4>
            <p>
              所学课程<a href="">《ANDROID/安卓/自定义控件/NDK/架构/REACT/性能优化【动脑学院】》</a>动脑学院ANDROID开发课程毕业学员，就职于新浪，任职安卓高级工程师，薪资15K*16
            </p>
          </div>
        </div>
      </div>
      <div class="col-md-6 col-xs-12 student">
        <div class="media">
          <a class="media-left" href="#">
            <img src="img/student3.png" alt="...">
          </a>
          <div class="media-body">
            <h4 class="media-heading">黄洁</h4>
            <p>
              所学课程<a href="">《ANDROID/安卓/自定义控件/NDK/架构/REACT/性能优化【动脑学院】》</a>动脑学院ANDROID开发课程毕业学员，就职于新浪，任职安卓高级工程师，薪资15K*16
            </p>
          </div>
        </div>
      </div>
      <div class="col-md-6 col-xs-12 student">
        <div class="media">
          <a class="media-left" href="#">
            <img src="img/student4.png" alt="...">
          </a>
          <div class="media-body">
            <h4 class="media-heading">范娟</h4>
            <p>
              所学课程<a href="">《ANDROID/安卓/自定义控件/NDK/架构/REACT/性能优化【动脑学院】》</a>动脑学院ANDROID开发课程毕业学员，就职于新浪，任职安卓高级工程师，薪资15K*16
            </p>
          </div>
        </div>
      </div>
    </div>
  </div>
  <div class="container">
    <div class="row">
      <div class="col-md-12">
        <h3>师资团队</h3>
        <hr>
      </div>
    </div>
    <div class="row">
      <div class="col-md-3 col-xs-6">
        <a class="thumbnail" href="#">
          <img src="img/t01.png" alt="">
          <div class="caption text-center">
            <h4>专家顾问团队</h4>
            <p>课程质量保证</p>
          </div>
        </a>
      </div>
      <div class="col-md-3 col-xs-6">
        <a class="thumbnail" href="#">
          <img src="img/t02.png" alt="">
          <div class="caption text-center">
            <h4>金牌讲师团队</h4>
            <p>教学质量保证</p>
          </div>
        </a>
      </div>
      <div class="col-md-3 col-xs-6">
        <a class="thumbnail" href="#">
          <img src="img/t03.png" alt="">
          <div class="caption text-center">
            <h4>教学服务团队</h4>
            <p>服务质量保证</p>
          </div>
        </a>
      </div>
      <div class="col-md-3 col-xs-6">
        <a class="thumbnail" href="#">
          <img src="img/t04.png" alt="">
          <div class="caption text-center">
            <h4>就业指导团队</h4>
            <p>就业质量保证</p>
          </div>
        </a>
      </div>
    </div>
  </div>
  <div class="container">
    <div class="row">
      <div class="col-md-12">
        <h3>合作伙伴</h3>
        <hr>
      </div>
    </div>
    <div class="row">
      <div class="col-xs-12 col-md-8">
        <div class="col-xs-4 col-md-2 friends">
          <img class="img-responsive img-circle img-thumbnail" src="img/alibaba.png" alt="">
        </div>
        <div class="col-xs-4 col-md-2 friends">
          <img class="img-responsive img-circle img-thumbnail" src="img/asiainfo.png" alt="">
        </div>
        <div class="col-xs-4 col-md-2 friends">
          <img class="img-responsive img-circle img-thumbnail" src="img/baidu.png" alt="">
        </div>
        <div class="col-xs-4 col-md-2 friends">
          <img class="img-responsive img-circle img-thumbnail" src="img/huawei.png" alt="">
        </div>
        <div class="col-xs-4 col-md-2 friends">
          <img class="img-responsive img-circle img-thumbnail" src="img/alibaba.png" alt="">
        </div>
        <div class="col-xs-4 col-md-2 friends">
          <img class="img-responsive img-circle img-thumbnail" src="img/alibaba.png" alt="">
        </div>
        <div class="col-xs-4 col-md-2 friends">
          <img class="img-responsive img-circle img-thumbnail" src="img/alibaba.png" alt="">
        </div>
        <div class="col-xs-4 col-md-2 friends">
          <img class="img-responsive img-circle img-thumbnail" src="img/alibaba.png" alt="">
        </div>
        <div class="col-xs-4 col-md-2 friends">
          <img class="img-responsive img-circle img-thumbnail" src="img/alibaba.png" alt="">
        </div>
        <div class="col-xs-4 col-md-2 friends">
          <img class="img-responsive img-circle img-thumbnail" src="img/alibaba.png" alt="">
        </div>
        <div class="col-xs-4 col-md-2 friends">
          <img class="img-responsive img-circle img-thumbnail" src="img/alibaba.png" alt="">
        </div>
        <div class="col-xs-4 col-md-2 friends">
          <img class="img-responsive img-circle img-thumbnail" src="img/alibaba.png" alt="">
        </div>
        <div class="col-xs-4 col-md-2 friends">
          <img class="img-responsive img-circle img-thumbnail" src="img/alibaba.png" alt="">
        </div>
        <div class="col-xs-4 col-md-2 friends">
          <img class="img-responsive img-circle img-thumbnail" src="img/alibaba.png" alt="">
        </div>
        <div class="col-xs-4 col-md-2 friends">
          <img class="img-responsive img-circle img-thumbnail" src="img/alibaba.png" alt="">
        </div>
        <div class="col-xs-4 col-md-2 friends">
          <img class="img-responsive img-circle img-thumbnail" src="img/alibaba.png" alt="">
        </div>
        <div class="col-xs-4 col-md-2 friends">
          <img class="img-responsive img-circle img-thumbnail" src="img/alibaba.png" alt="">
        </div>
        <div class="col-xs-4 col-md-2 friends">
          <img class="img-responsive img-circle img-thumbnail" src="img/alibaba.png" alt="">
        </div>
      </div>
      <div class="col-xs-12 col-md-4">
        <div class="list-group">
          <a class="list-group-item active lead">
            常见问题
          </a>
          <a href="#" class="list-group-item">Dapibus ac facilisis in</a>
          <a href="#" class="list-group-item">Morbi leo risus</a>
          <a href="#" class="list-group-item">Porta ac consectetur ac</a>
          <a href="#" class="list-group-item">Porta ac consectetur ac</a>
          <a href="#" class="list-group-item">Porta ac consectetur ac</a>
          <a href="#" class="list-group-item">Vestibulum at eros</a>
        </div>
      </div>
    </div>
  </div>
  <footer class="container">
    <div class="row text-center">
      <hr>
      <h4>湖南动脑信息科技有限公司</h4>
      <p>Copyright 2008-2016 www.dongnaoedu.com</p>
    </div>
  </footer>
  <script src="./node_modules/jquery/dist/jquery.min.js"></script>
  <script src="./node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
</body>
</html>
